﻿<%@ page language="java" import="com.newcrm.config.Const,com.newcrm.util.Util,com.newcrm.bean.*,java.util.List,java.util.Map" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
  User user = (User) session.getAttribute("user");
  Map<Integer, CompanyInfo> companys = (Map<Integer, CompanyInfo>) application.getAttribute(Const.APPLICATION_COMPANYS);
  CompanyInfo companyInfo = companys.get(Integer.valueOf(user.companyId));
  List<Map<String, Object>> dealCategory = companyInfo.dealCategorys;
  List<User> users = companyInfo.users;

  String customerId = (String)request.getAttribute("customerId");
  if (customerId == null) {
    customerId = "";
  }
  String customerName = (String)request.getAttribute("customerName");
  if (customerName == null) {
    customerName = "";
  }

  Integer tmp = (Integer)request.getAttribute("customerType");
  int customerType = 0;
  if (tmp != null) {
    customerType = tmp.intValue();
  }
  String customerCss = "company";
  if (customerType == Const.TYPE_PEOPLE) {
    customerCss = "people";
  }
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>添加销售机会</title>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <meta name="renderer" content="webkit"/>
  <meta http-equiv="X-UA-Compatible" content="IE=Edge">
  <link rel="shortcut icon" href="<%=request.getContextPath()%>/images/qikebao.ico" />
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/all.css?ver=<%=Const.VERSION%>">
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/font-awesome/css/font-awesome.min.css">
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/datepicker.css" />
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/bootstrap-datetimepicker.min.css" />
  <link rel="stylesheet" href="<%=request.getContextPath()%>/css/magnific-popup.css">
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery-1.11.1.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/bootstrap.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery-ui.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery.bootstrap-growl.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/moment.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/bootstrap-datepicker.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/bootstrap-datetimepicker.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/daterangepicker.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery.magnific-popup.min.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/jquery.cookie.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/popbox.js"></script>
  <script type="text/javascript" src="<%=request.getContextPath()%>/script/common.js?ver=<%=Const.VERSION%>"></script>
  <script>
    $(function() {
      $("#dealsMenu").addClass("selected");
      $('.datepickerinput').datepicker({todayHighlight:true,language:'zh-CN'});
      $("#add_link").click(function(e) {
        e.preventDefault();
        $('#newForm').submit();
      });
      $('#newForm').submit(function(event){
        if ($("#customerId").val() == "") {
          alert("请选择关联人/公司");
          return false;
        }
        if ($("#deal_name").val() == "") {
          alert("请输入销售机会名称");
          return false;
        }

        if (isNaN($("#deal_price").val())) {
          alert("金额必须为数字");
          $("#deal_price").focus();
          return false;
        }
        if (isNaN($("#deal_commission").val())) {
          alert("销售提成金额必须为数字");
          $("#deal_commission").focus();
          return false;
        }

        var mandatoryFlag = false;
        $( "input.fieldMandatory" ).each(function() {
          if ($(this).val() == "") {
            mandatoryFlag = true;
            alert($(this).attr("fieldlable")+"字段为必填项，请输入内容");
            return false;
          }
        });
        $( "select.fieldMandatory" ).each(function() {
          if ($(this).val() == "") {
            mandatoryFlag = true;
            alert($(this).attr("fieldlable")+"字段为必填项，请选择内容");
            return false;
          }
        });

        if (mandatoryFlag) {
          return false;
        }

        return true;
      });

      if ($("#customerId").val() != "") {
        toggleChoseParty();
      }

      $("#deal_fields_link").click(function(e) {
        e.preventDefault();
        var _link = $(this).find("i");
        $("#custom_fields_table").toggle();
        if($('#custom_fields_table').is(':visible')) {
          _link.removeClass("fa-minus").addClass("fa-plus");
        } else {
          _link.removeClass("fa-plus").addClass("fa-minus");
        }
      });

      $("#chosen_deal_party_link").click(function(e) {
        e.preventDefault();
        toggleChoseParty();
      });

      $("#live_search_for_deal").autocomplete({
        source: "<%=request.getContextPath()%>/customerName?operation=list&type=-1&isFromDeals=1",
        select: function(event, ui ) {
          var _id = ui.item ? ui.item.id : "";
          var _type = ui.item ? ui.item.Type : "";
          var _name = ui.item ? ui.item.value : "";
          $("#customerId").val(_id);
          $("#customerName").val(_name);
          $("#customerType").val(_type);
          toggleChoseParty();
          var _css = "";
          if (_type == 0) {
            _css= "company";
          } else {
            _css = "people";
          }
          $("#deal_party_avatar").removeClass("company").removeClass("people").addClass(_css).text(_name).attr("title", _name);
          $("#deal_party_name").text(_name);
         }
      }).data("ui-autocomplete")._renderItem = function(ul, item) {
        return $( "<li></li>" )
          .data( "ui-autocomplete-item", item)
          .append("<a>" + item.label + "</a>")
          .appendTo(ul);
      };
    });
    function toggleChoseParty() {
      $("#chosen_deal_party_table").toggle();
      $("#deal_search_for_party").toggle();
    }
  </script>
</head>
<body class="parties former_sheet">
  <jsp:include page="topNavi.jsp" flush="true"/>
  <div class="main-page">
    <table>
    <tr>
      <td class="main-body">
        <div class="topnavi">
          <div class='leftMenu'>
            <span>添加销售机会</span>
          </div>
        </div>
        <div class="edit-page">
          <form action="<%=request.getContextPath()%>/deals" autocomplete="off" method="post" id="newForm">
            <input type="hidden" name="operation" value="new">
            <input type="hidden" id="customerId" name="customerId" value="<%=customerId%>">
            <input type="hidden" id="customerName" name="customerName" value="<%=Util.HTMLEncode(customerName)%>">
            <input type="hidden" id="customerType" name="customerType" value="<%=customerType%>">
            <div id="chosen_deal_party" class="avatar_subject">
              <h4>联系人/公司</h4>
              <div id="deal_search_for_party">
                <p style="margin:0"><span class="details">请输入联系人/公司的名称，并从提示的公司名列表中选择</span></p>
                <div class="field">
                  <input class="live_search_field name" id="live_search_for_deal" type="text" /> <span class="extInfo">(必填)</span>
                </div>
              </div>
              <table class="chosen_deal_party_table" id="chosen_deal_party_table" border="0" cellspacing="0" cellpadding="0" style="display:none;">
                <tr>
                  <th><span id="deal_party_avatar" class="sprite avatar company" title=""></span></th>
                  <td>
                    <strong id="deal_party_name"><%=Util.HTMLEncode(customerName)%></strong><br />
                    <span><a href="#" id="chosen_deal_party_link">选择其他联系人/公司</a></span>
                  </td>
                </tr>
              </table>
            </div>
            <div class="deal_details">
              <h4>销售机会名称</h4>
              <input class="name" id="deal_name" name="dealName" size="30" type="text" /> <span class="extInfo">(必填)</span>
            </div>
            <div class="deal_details">
              <h4>销售机会描述或背景信息</h4>
              <div><textarea cols="40" id="deal_background" name="background" rows="20" style="height: 100px;width: 100%"></textarea></div>
            </div>
            <div class="deal_details">
              <h4>金额（元）</h4>
              <input id="deal_price" name="price" size="30" style="width:175px;" type="text" />
            </div>
            <div class="deal_details">
              <h4>销售提成金额（元）</h4>
              <input id="deal_commission" name="commission" size="30" style="width:175px;" type="text" />
            </div>
            <div class="deal_details">
              <h4>分类(提示：分类可以是产品的名称)</h4>
              <select id="deal_categoryId" name="categoryId" class="categoryId">
              <option value="0">无</option>
              <%for (Map<String, Object> cate:dealCategory) { %>
              <option value="<%=cate.get("DealCategoryId")%>"><%=Util.HTMLEncode((String)cate.get("DealCategoryName"))%></option>
              <%}%></select>
              <% if (user.isAdmin) {%>
              <a href="<%=request.getContextPath()%>/dealcategory">编辑分类</a>
              <%}%>
            </div>
            <div class="deal_details">
              <h4>负责人</h4>
              <select id="deal_responsibleUserId" name="responsibleUserId" class="responsibleUserId">
              <option value="<%=user.userId%>">我</option>
              <%
                  String groupName = null;
                  for (User u : users) {
                    if (u.userId.equals(user.userId)) {
                      continue;
                    }
                    if (!companyInfo.isGroupAdmin(user, u.groupId)) {
                      continue;
                    }
                    String gn = companyInfo.getGroupName(u);
                    if (groupName == null) {
                      if (gn != null) {
                        groupName = gn;  %>
                  <optgroup label="<%=Util.HTMLEncode(groupName)%>">
               <%
                      }
                    } else {
                      if (!groupName.equals(gn)) {
                        groupName = gn; %>
                  </optgroup>
                  <optgroup label="<%=Util.HTMLEncode(groupName)%>">
               <%
                      }
                    }
                %>
                  <option value="<%=u.userId%>"><%=Util.HTMLEncode(u.name)%>的客户</option>
                <%}
                  if (groupName != null && groupName.length() > 0) { %>
                  </optgroup>
                <%}%></select>
            </div>
            <div class="custom_fields">
              <div class="custom_fields_header">
                <h1><a href="#" id="deal_fields_link" title="点击可以展开/缩起自定义信息"><i class="fa fa-plus"></i> 自定义信息</a> </h1>
                <% if (user.isAdmin) {%>
                <a href="<%=request.getContextPath()%>/dealfield" class="link_to"><i class="fa fa-cog"></i> 设置自定义信息</a>
                <% }%>
              </div>
              <%List<Map<String, Object>> fields = (List<Map<String, Object>>) request.getAttribute("fields");
              if (fields != null && fields.size() > 0) {%>
              <table id="custom_fields_table" cellpadding="0" cellspacing="0"><%
              for (Map<String, Object> field:fields) {
                int valueType = Util.str2Int(field.get("ValueType"));
                String initValue = (String) field.get("InitValue");
                int extInfoId = Util.str2Int(field.get("DealFieldId"));
                boolean isMandatory = (Util.str2Int(field.get("Mandatory")) == 1);
                String inputClass = "";
                if (isMandatory) {
                  inputClass = "fieldMandatory";
                }
              %>
              <tr>
                <th><span><%=Util.HTMLEncode((String)field.get("DealFieldName"))%>
                  <% if (isMandatory) { %>
                  <span class="mandatory">(必填)</span>
                  <% } %>
                  </span></th>
                <td >
                 <input name="<%=Const.FIELDID_KEY%>_<%=field.get("DealFieldId")%>" type="hidden" value="0" />
                 <%if (valueType == Const.FIELD_TYPE_DATE) {%>
                 <input fieldLable="<%=Util.HTMLEncode((String)field.get("DealFieldName"))%>" class="<%=inputClass%>" name="<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>" id="<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>_datepicker" size="30" type="text" />
                 <script>
                  $("#<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>_datepicker").datepicker({todayHighlight:true,language:'zh-CN'});
                 </script>
                 <%} else if (valueType == Const.FIELD_TYPE_SELECT) {%>
                 <select fieldLable="<%=Util.HTMLEncode((String)field.get("DealFieldName"))%>" name="<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>" class="<%=inputClass%>">
                  <option value="">请选择</option>
                 <%
                  if (initValue != null && initValue.length() > 0) {
                    String[] arr = initValue.split(",");
                    for (String v:arr) { %>
                  <option value="<%=Util.HTMLEncode(v)%>"><%=Util.HTMLEncode(v)%></option>
                 <%  }
                  }%>
                 </select>
                 <%} else if (valueType == Const.FIELD_TYPE_CHECKBOX) {
                    if (initValue != null && initValue.length() > 0) {
                      String[] arr = initValue.split(",");
                      for (String v:arr) { %>
                    <label><input type="checkbox" name="<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>" value="<%=Util.HTMLEncode(v)%>"> <%=Util.HTMLEncode(v)%></label>
                 <%   }
                    }
                  } else if (valueType == Const.FIELD_TYPE_NUMBER) { %>
                <input fieldLable="<%=Util.HTMLEncode((String)field.get("DealFieldName"))%>" class="ime-disabled" name="<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>" class="<%=inputClass%>" id="<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>_number" size="30" type="text" />
                <script>
                  $('#<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>_number').bind('keypress', function(e) {
                    return ( e.which!=8 && e.which!=0 && (e.which<48 || e.which>57)) ? false : true;
                  });
                </script>
                <%} else {%>
                <input fieldLable="<%=Util.HTMLEncode((String)field.get("DealFieldName"))%>" name="<%=Const.FIELD_KEY%>_<%=field.get("DealFieldId")%>" class="<%=inputClass%>" size="30" type="text" />
                 <%}%>
                </td>
              </tr>
          <%
              }
          %>
              </table>
          <%
            }
          %>
            </div>
            <p class="submit">
              <a id="add_link" class="button blue" href="#"><i class="fa fa-check"></i> 添加销售机会</a>
              <a class="button grey" href="#" onclick="window.history.go(-1); return false;"><i class="fa fa-times"></i> 取消</a>
            </p>
          </form>
        </div>
      </td>
      <td class="main-sidebar">
        <div class="content">
          <h2 class="clearfix">什么是销售机会</h2>
          <div class="detail">销售机会即业务机会或商业机会，比如一笔可能成交的业务或项目。</div>
          <div class="detail">销售机会适用于金额较大，或者跟进周期较长的业务或项目。</div>
          <div class="detail">销售机会通常跟一个公司/联系人相关，您需要先将这个公司/联系人添加到系统。</div>
          <div class="detail">在输入公司/联系人时，系统会根据已输入的内容自动查找公司/联系人，并以下拉列表的形式显示出来，您可以从中选取一个。</div>
          <div class="detail">您可以根据自己的业务情况给机会添加分类。比如按产品分类、按重要程度或行业分类。</div>
          <div class="detail">也可以添加相关的负责人。</div>
        </div>
      </td>
    </tr>
    </table>
  </div>
</body>
</html>